import React, { Component } from "react";
import { Flex } from "antd-mobile";
import "./index.scss";
class MySearch extends Component {
  componentDidMount() {}

  render() {
    const { NavigationRoute, curCityName } = this.props;

    return (
      <div className="searchWrapper">
        <Flex className="searchContent">
          {/* 左侧 */}
          <Flex className="search">
            {/* 左侧地区 */}
            <div
              className="location"
              onClick={() => {
                NavigationRoute("/cityList");
              }}
            >
              <div className="position">{curCityName}</div>
            </div>
            {/* 右侧搜索框 */}
            <div className="form" onClick={() => {}}>
              <i className="iconfont icon-sousuo" />
              <input className="text" placeholder="请输入小区或地区"></input>
            </div>
          </Flex>
          {/* 右侧 */}
          <Flex className="mapSearch">
            {/* 右侧地图图标 */}
            <span
              style={{ fontSize: "30px", fontWeight: "bolder" }}
              className="iconfont icon-tubiaozhizuomoban_canbaorenshenfenleibie_ditu"
              onClick={() => {
                NavigationRoute("/map");
              }}
            />
          </Flex>
        </Flex>
      </div>
    );
  }
}

export default MySearch;
